<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <title>DropMenuX - selectbox test</title>
    <style type="text/css">
    body {
        font: 11px tahoma;
        background: #ffffff;
        margin: 0;
        padding: 50px;
    }
    </style>
    <link rel="stylesheet" type="text/css" href="../example1.css" />
    <script type="text/javascript" src="../../ie5.js"></script>
    <script type="text/javascript" src="../DropMenuX.js"></script>
</head>
<body>

    <table cellspacing="0" cellpadding="0" id="menu1" class="dmx">
    <tr>
        <td>
            <a class="item1" href="javascript:void(0)">Products</a>
            <div class="section">
                <a class="item2" href="selectbox.html">Product One</a>
                <a class="item2 arrow" href="javascript:void(0)">Product Two<img src="../images/arrow1.gif" width="10" height="12" alt="" /></a>
                <div class="section">
                    <a class="item2" href="selectbox.html">Overview</a>
                    <a class="item2" href="selectbox.html">Features</a>
                    <a class="item2" href="selectbox.html">Requirements</a>
                    <a class="item2" href="selectbox.html">Flash Demos</a>
                </div>
                <a class="item2 arrow" href="javascript:void(0)">Product Three<img src="../images/arrow1.gif" width="10" height="12" alt="" /></a>
                <div class="section">
                    <a class="item2" href="selectbox.html">Overview</a>
                    <a class="item2" href="selectbox.html">Features</a>
                    <a class="item2" href="selectbox.html">Requirements</a>
                    <a class="item2" href="selectbox.html">Screenshots</a>
                    <a class="item2" href="selectbox.html">Flash Demos</a>
                    <a class="item2 arrow" href="javascript:void(0)">Live Demo<img src="../images/arrow1.gif" width="10" height="12" alt="" /></a>
                    <div class="section">
                        <a class="item2" href="selectbox.html">Create Account</a>
                        <a class="item2 arrow" href="javascript:void(0)">Test Drive<img src="../images/arrow1.gif" width="10" height="12" alt="" /></a>
                        <div class="section">
                            <a class="item2" href="selectbox.html">Test One</a>
                            <a class="item2" href="selectbox.html">Test Two</a>
                            <a class="item2" href="selectbox.html">Test Three</a>
                        </div>
                    </div>
                </div>
                <a class="item2 arrow" href="javascript:void(0)">Product Four<img src="../images/arrow1.gif" width="10" height="12" alt="" /></a>
                <div class="section">
                    <a class="item2" href="selectbox.html">Overview</a>
                    <a class="item2" href="selectbox.html">Features</a>
                    <a class="item2" href="selectbox.html">Requirements</a>
                </div>
                <a class="item2" href="selectbox.html">Product Five</a>
            </div>
        </td>
        <td>
            <a class="item1" href="javascript:void(0)">Downloads</a>
            <div class="section">
                <a class="item2" href="selectbox.html">30-day Demo Key</a>
                <a class="item2 arrow" href="javascript:void(0)">Product One Download<img src="../images/arrow1.gif" width="10" height="12" alt="" /></a>
                <div class="section">
                    <a class="item2" href="selectbox.html">Linux Download</a>
                    <a class="item2" href="selectbox.html">Solaris Download</a>
                    <a class="item2" href="selectbox.html">Windows Download</a>
                </div>
                <a class="item2 arrow" href="javascript:void(0)">Product Two Download<img src="../images/arrow1.gif" width="10" height="12" alt="" /></a>
                <div class="section">
                    <a class="item2" href="selectbox.html">Linux Download</a>
                </div>
            </div>
        </td>
        <td>
            <a class="item1" href="javascript:void(0)">Support</a>
            <div class="section">
                <a class="item2" href="selectbox.html">E-mail Support</a>
                <a class="item2" href="selectbox.html">Phone Support</a>
                <a class="item2" href="selectbox.html">WWW support</a>
            </div>
        </td>
        <td>
            <a class="item1" href="javascript:void(0)">Partners</a>
            <div class="section">
                <a class="item2" href="selectbox.html">Benefits</a>
                <a class="item2 arrow" href="javascript:void(0)">Applications<img src="../images/arrow1.gif" width="10" height="12" alt="" /></a>
                <div class="section">
                    <a class="item2" href="selectbox.html">Application One</a>
                    <a class="item2" href="selectbox.html">Application Two</a>
                    <a class="item2" href="selectbox.html">Application Three</a>
                    <a class="item2" href="selectbox.html">Application Four</a>
                    <a class="item2" href="selectbox.html">Application Five</a>
                    <a class="item2" href="selectbox.html">Application Six</a>
                    <a class="item2" href="selectbox.html">Application Seven</a>
                </div>
                <a class="item2" href="selectbox.html">Listing</a>
            </div>
        </td>
        <td>
            <a class="item1" href="javascript:void(0)">Customers</a>
            <div class="section">
                <a class="item2" href="selectbox.html">Customer One</a>
                <a class="item2" href="selectbox.html">Customer Two</a>
                <a class="item2" href="selectbox.html">Customer Three</a>
            </div>
        </td>
        <td>
            <a class="item1" href="javascript:void(0)">About Us</a>
            <div class="section">
                <a class="item2" href="selectbox.html">Executive Team</a>
                <a class="item2" href="selectbox.html">Investors</a>
                <a class="item2" href="selectbox.html">Career Opportunities</a>
                <a class="item2 arrow" href="javascript:void(0)">Press Center<img src="../images/arrow1.gif" width="10" height="12" alt="" /></a>
                <div class="section">
                    <a class="item2" href="selectbox.html">Products Information</a>
                </div>
                <a class="item2" href="selectbox.html">Success Stories</a>
                <a class="item2" href="selectbox.html">Contact Us</a>
            </div>
        </td>
    </tr>
    </table>

    <select>
        <option>Works with selectboxes on IE6</option>
    </select>

    <p>
        <b>Project</b>: <a href="http://www.gosu.pl/MyGosuMenu/">MyGosuMenu</a> <br />
        <b>Menu type</b>: DropMenuX - selectbox test<br />
        <b>Features</b>: <br />
        - horizontal or vertical menu <br />
        - unlimited nesting <br />
        - can be positioned statically or absolutely <br />
        - delay for showing/hiding menu (can be turned off by setting to 0) <br />
        - position of submenus can be changed, so they can for example overflow parent elements <br />
        - on the same page there can be many menus created <br />
        - seperated into 3 layers: behaviour(javascript), structure(html), presentation(css) <br />
        - search engine friendly <br />
        - free for any use (BSD license) <br />
        - works with selectboxes on IE6 <br />
        <b>Compatibility</b>: Tested and works great on: IE 5.0/5.5/6.0, Mozilla 1.4/1.7, Opera 7.11/7.23/7.51, Netscape 7.11, Firefox 0.7/0.8/0.9, Safari 1.2
    </p>

    <script type="text/javascript">
    var dmx = new DropMenuX('menu1');
    dmx.delay.show = 0;
    dmx.delay.hide = 400;
    dmx.position.levelX.left = 2;
    dmx.init();
    </script>

</body>
</html>